<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/views/include/taglib.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="/views/include/nocachehead.jsp"%>
<%@ include file="/views/include/statusbar.jsp"%>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
<script type="text/javascript" src="http://j.maxmind.com/app/geoip.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/js/map.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/js/validator/discoverySpotForm.js"></script>
</head>
<style type="text/css">
.mainBox1 {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 600px;
	width: 700px;
}

.mainBox2 {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 200px;
	width: 700px;
}

.mainBox3 {
	border: 1px dashed #0099CC;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 400px;
	width: 260px;
}
</style>

<script type="text/javascript">
	function getCountries(userCountry, userProvince, userCity) {
		var country = document.getElementById("country");
		$.ajax({
			url : "/skyline/site/getCountries.html",
			type : "POST",
			dataType : "json",
			contentType : "application/x-www-form-urlencoded; charset=utf-8",
			success : function(msg) {
				for ( var i = 0; i < msg.length; i++) {
					var varItem = new Option(msg[i].name, msg[i].name + "-"
							+ msg[i].id);
					if (msg[i].name == userCountry) {
						varItem.selected = true;
					}
					country.options.add(varItem);
				}
				getProvinces(userProvince, userCity);
			}
		});
	}
	function getProvinces(userProvince, userCity) {
		var province = document.getElementById("province");
		var country = document.getElementById("country").value;
		var countryId = country.split("-")[1];
		$.ajax({
			url : "/skyline/site/getSubSites.html",
			type : "POST",
			data : "siteId=" + countryId,
			dataType : "json",
			contentType : "application/x-www-form-urlencoded; charset=utf-8",
			success : function(msg) {
				province.options.length = 0;
				for ( var i = 0; i < msg.length; i++) {
					var varItem = new Option(msg[i].name, msg[i].name + "-"
							+ msg[i].id);
					if (msg[i].name == userProvince) {
						varItem.selected = true;
					}
					province.options.add(varItem);
				}
				getCities(userCity)
			}
		});
	}
	function getCities(userCity) {
		var city = document.getElementById("city");
		var province = document.getElementById("province").value;
		var provinceId = province.split("-")[1];
		$.ajax({
			url : "/skyline/site/getSubSites.html",
			type : "POST",
			data : "siteId=" + provinceId,
			dataType : "json",
			contentType : "application/x-www-form-urlencoded; charset=utf-8",
			success : function(msg) {
				city.options.length = 0;
				for ( var i = 0; i < msg.length; i++) {
					var varItem = new Option(msg[i].name, msg[i].name + "-"
							+ msg[i].id);
					if (msg[i].name == userCity) {
						varItem.selected = true;
					}
					city.options.add(varItem);
				}
			}
		});
	}
	function checkExit() {
		$.ajax({
			url : "/skyline/spot/isexit.html",
			type : "POST",
			data : "name=" + $('#name').val(),
			dataType : "json",
			contentType : "application/x-www-form-urlencoded; charset=utf-8",
			success : function(msg) {
				alert(msg);
				if (msg) {
					alert("存在该景点");
				}
			}
		});

	}
	$(document).ready(

			function() {
				getCountries('${spotInfo.country}', '${spotInfo.province}', '${spotInfo.city}');
				$('#category').get( 0 ).value  =  "${spotInfo.category}";     
				  var myIcon = new BMap.Icon( "http://openapi.baidu.com/map/images/custom_a_j.png",new BMap.Size(28, 37),
						  {
						     offset: new BMap.Size(10, 25),
						  imageOffset: new BMap.Size(0 - 0 * 28, 0)
						  });
				loadMap(mapContainer,new BMap.Point(${spotInfo.longitude},${spotInfo.latitude}));
				var marker = new BMap.Marker(new BMap.Point(${spotInfo.longitude},${spotInfo.latitude}) ,{icon: myIcon}); // 创建标注
				addMarkerOnMap(map, marker);
				marker.enableDragging(true); // 设置标注可拖拽
				marker.addEventListener("dragend", function(e){  
					$("#longitude").val(e.point.lng);
					$("#latitude").val(e.point.lat);
					});

			});
				
</script>
<body>
	<br>
	<br>
	<br>

	<div class="mainBox1">
		<p>${spotInfo.name }基本信息：</p>
		<form id="editSpotBasicForm" name="editSpotBasicForm"
			action="${pageContext.request.contextPath}/spot/${spotInfo.id }/editbasic.html"
			method="post">
			<c:out value="${requestScope.errMsg}" escapeXml="false" />

			<label>地点名称：</label> <input id="id" name="id" type="hidden"
				value="${spotInfo.id}" /> <input id="administratorId"
				name="administratorId" type="hidden"
				value="${spotInfo.administratorId}" /> <input id="name" name="name"
				value="${spotInfo.name }" /> <input type="button" id="serch"
				value='查找'
				onclick="serchFromCityByName($('#city').val(),$('#name').val(),null)">
			<br> <label> 分类：</label> <select id="category" name="category">
				<option value="OTHER">其他</option>
				<option value="VIEWPOINT">景点</option>

			</select> <br> <label>地点：</label> <select id="country" name="country"
				onchange="getProvinces('','')"></select> <select id="province"
				name="province" onchange="getCities('')"></select> <select id="city"
				name="city">
			</select> <label> 具体地址：</label> <input type="text" name="detailAddress"
				id="detailAddress" value="${spotInfo.detailAddress }" /> <br>
			<div id="mapContainer" style="height: 440px; width: 680px;"></div>
			<input id="latitude" name="latitude" type="hidden"
				value="${spotInfo.latitude}"> <input id="longitude"
				name="longitude" type="hidden" value="${spotInfo.longitude}">
			<br> <input type="hidden" name="submitToken"
				value='<skyline:sessionAttribute key="SESSION_SUBMIT_TOKEN"/>' /> <input
				type="submit" name="submit" value="保存修改">
		</form>

	</div>
	<div class="mainBox3">
		<img alt="${spotInfo.name }"
			src="${portraitPath }/${spotInfo.portrait}"> 
			<a href="${pageContext.request.contextPath}/spot/${spotInfo.id }/editPortrait.html">编辑头像</a>
	</div>
	<div class="mainBox2">
		<p>简介：</p>
		<form id="editSpotIntroductionForm"
			action="${pageContext.request.contextPath}/spot/${spotInfo.id }/editintro.html"
			method="post">
			<input id="id" name="id" type="hidden" value="${spotInfo.id}" /> <input
				id="administratorId" name="administratorId" type="hidden"
				value="${spotInfo.administratorId}" />
			<textarea rows="5" cols="30" id="introduction" name="introduction">${spotInfo.introduction}</textarea>

			<input type="hidden" name="submitToken"
				value='<skyline:sessionAttribute key="SESSION_SUBMIT_TOKEN"/>' /> <input
				type="submit" name="submit" value="保存修改">
		</form>
	</div>

	<script type="text/javascript">
					(function($){$(document).ready(function(){
						$('#editSpotBasicForm').submit(function(){
							return true;
						});
						$('#editSpotIntroductionForm').submit(function(){
							return true;
						});
					});})(jQuery);
				</script>
</body>
</html>